import React, { useEffect, useState } from "react";
import { Modal, Table } from "antd";
import { accountFundTypes, modalPropsType } from "@/constants/types";
import XlTableDictColumn from "@/components/Table/XlTableDictColumn";
import { queryAllByCustomerCode } from "@/pages/FinanceManage/services";


const CapitalFlow = ({visible, title, currentRow, onCancel}: modalPropsType) => {
  const [flows, setFlows] = useState([]); 


  const search = async (code: string) => {
    const res = await queryAllByCustomerCode({customerCode: code});
    setFlows(res || []);
  }

  const columns = [
    {
      title: "资金出入",
      dataIndex: "amount",
    },
    {
      title: "业务类型",
      dataIndex: "category",
      render: (_: any, record: accountFundTypes) => <XlTableDictColumn value={record?.category} type="accChangeType" />
    },
    {
      title: "备注",
      dataIndex: "remark",
      ellipsis: true,
    },
    {
      title: "账户余额",
      dataIndex: "balance",
    },
    {
      title: "业务时间",
      dataIndex: "businessTime",
    },
  ];

  useEffect(() => {
    if (currentRow?.code) {
      search(currentRow?.code);
    } else {
      setFlows([]);
    }
  }, [currentRow?.code])

  return (
    <Modal
      title={title} 
      open={visible}
      onCancel={onCancel}
      footer={false}
      maskClosable={false}
      width="1000px"
    >
      <Table
        rowKey="id"
        columns={columns}
        dataSource={flows}
      />
    </Modal>
  );
}
export default CapitalFlow;